<template>
  <div class="container">
    <topTitle
      :titleText="titleText"
      :back="back"
      @gobackTriser="goBack"
    ></topTitle>
    <div class="mainCon" id="niceScroll">
      <el-form
        :model="formData"
        label-width="164px"
        :rules="formRules"
        ref="formData"
        class="form"
        v-if="showForm"
      >
        <el-form-item label="项目名称：">
          <el-select
            style="display: none"
            ref="projectNameSearch"
            v-model="formData.projectId"
            clearable
            filterable
            placeholder="请输入项目名称进行搜索"
          >
            <el-option
              v-for="(item, index) in projectOptions"
              :key="index"
              :label="item.projectName"
              :value="index"
            ></el-option>
          </el-select>
          <span>{{ formData.projectName || '--' }}</span>
        </el-form-item>
        <el-form-item label="保证金缴纳方式：" prop="method">
          <el-radio-group
            v-if="isHsUser()"
            v-model="formData.method"
            @change="payTypeChange"
          >
            <el-radio label="FUNDDEPOSIT">资金存入</el-radio>
            <el-radio label="BANKGUARANTEE">银行保函</el-radio>
            <el-radio label="BANKPOLICY">保险保单</el-radio>
          </el-radio-group>
          <el-radio-group
            v-else
            v-model="formData.method"
            @change="payTypeChange"
          >
            <el-radio label="FUNDDEPOSIT">资金存入</el-radio>
            <el-radio label="BANKGUARANTEE">银行保函</el-radio>
            <el-radio label="OWNERPOLICY">{{
              isXiangYangUser() ? '工程担保公司保函' : '业主担保'
            }}</el-radio>
            <el-radio label="BANKPOLICY">保险保单</el-radio>
          </el-radio-group>
        </el-form-item>
        <!-- 选择资金存入才显示缴纳形式 -->
        <template v-if="loginType == 'XM'">
          <el-form-item
            class="radioTipsBox"
            label="缴纳形式："
            prop="payMethod"
            v-if="formData.method === 'FUNDDEPOSIT'"
          >
            <el-radio-group
              v-model="formData.payMethod"
              @change="payTypeChange"
              v-if="!cutSwitch"
            >
              <el-radio label="ALL_PAY">全额缴纳</el-radio>
              <el-radio label="PART_PAY">部分免缴</el-radio>
              <el-radio label="ALL_NO_PAY">全额免缴</el-radio>
              <el-radio label="WAIT_PAY">缓缴</el-radio>
            </el-radio-group>
            <el-radio-group
              v-model="formData.payMethod"
              @change="payTypeChange"
              v-if="cutSwitch && !openCut && !showWaitPay"
            >
              <el-radio label="ALL_PAY">全额缴纳</el-radio>
              <el-radio label="PART_PAY" disabled>部分免缴</el-radio>
              <el-radio label="ALL_NO_PAY" disabled>全额免缴</el-radio>
              <el-radio label="WAIT_PAY" disabled>缓缴</el-radio>
            </el-radio-group>
            <el-radio-group
              v-model="formData.payMethod"
              @change="payTypeChange"
              v-if="showWaitPay"
            >
              <el-radio label="ALL_PAY">全额缴纳</el-radio>
              <el-radio label="PART_PAY" disabled>部分免缴</el-radio>
              <el-radio label="ALL_NO_PAY" disabled>全额免缴</el-radio>
              <el-radio label="WAIT_PAY">缓缴</el-radio>
            </el-radio-group>
            <el-radio-group
              v-model="formData.payMethod"
              @change="payTypeChange"
              v-if="openCut && !showWaitPay"
            >
              <el-radio label="ALL_PAY">全额缴纳</el-radio>
              <el-radio label="PART_PAY" :disabled="forBird">部分免缴</el-radio>
              <el-radio label="ALL_NO_PAY" :disabled="forbidThree"
                >全额免缴</el-radio
              >
              <el-radio label="WAIT_PAY" disabled>缓缴</el-radio>
            </el-radio-group>
            <div
              class="radioTips"
              v-if="
                !forBird &&
                forbidThree &&
                loginType == 'XM' &&
                openCut &&
                !showWaitPay
              "
            >
              提示： 根据当前保证金制度，无法全额免缴及缓缴。
            </div>
            <div
              class="radioTips"
              v-if="
                (forBird && loginType == 'XM' && openCut && !showWaitPay) ||
                (cutSwitch && !openCut && !showWaitPay)
              "
            >
              提示： 根据当前保证金制度，无法免缴及缓缴。
            </div>
            <div class="radioTips" v-if="showWaitPay && loginType == 'XM'">
              提示： 根据当前保证金制度，无法免缴
            </div>
          </el-form-item>
        </template>
        <template v-if="loginType == 'QY'">
          <el-form-item
            class="radioTipsBox"
            label="缴纳形式："
            prop="payMethod"
            v-if="formData.method === 'FUNDDEPOSIT'"
          >
            <el-radio-group
              v-model="formData.payMethod"
              @change="payTypeChange"
            >
              <el-radio label="ALL_PAY">全额缴纳</el-radio>
              <el-radio label="PART_PAY">部分免缴</el-radio>
              <el-radio label="ALL_NO_PAY">全额免缴</el-radio>
              <el-radio label="WAIT_PAY">缓缴</el-radio>
            </el-radio-group>
          </el-form-item>
        </template>

        <el-form-item label="缴纳单位：" prop="reciveunit">
          <el-radio-group v-model="formData.reciveunit">
            <el-radio
              v-for="(item, index) in companyOptions"
              :key="index"
              :label="item.companyType"
              >{{ item.companyName }}({{
                item.companyType == '0' ? '建设方' : '施工方'
              }})</el-radio
            >
          </el-radio-group>
        </el-form-item>
        <template
          v-if="
            formData.method === 'FUNDDEPOSIT' &&
            formData.payMethod === 'WAIT_PAY'
          "
        >
          <el-form-item label="缓缴周期：">
            <el-date-picker
              type="daterange"
              class="mWidth"
              placeholder="请选择保证金缓缴日期"
              :disabled="showWaitPay"
              range-separator="至"
              v-model="operationDate"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </template>
        <template v-else>
          <el-form-item label="缴纳日期：" prop="operationDate">
            <el-date-picker
              type="date"
              class="sWidth"
              placeholder="请选择保证金缴纳日期"
              v-model="formData.operationDate"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </template>
        <!-- 资金存入-（全额缴纳/部分免缴）存在缴纳银行和缴纳账号信息 -->
        <el-form-item
          label="缴纳银行："
          prop="bankOne"
          v-if="
            formData.method === 'FUNDDEPOSIT' &&
            (formData.payMethod === 'ALL_PAY' ||
              formData.payMethod === 'PART_PAY')
          "
        >
          <el-radio-group v-model="formData.bankOne" @change="changeBankName">
            <el-radio
              v-for="(item, index) in bankNameList"
              :key="index"
              :label="item.bankId + ',' + item.account + ',' + item.bankName"
              >{{ item.bankName }}</el-radio
            >
          </el-radio-group>
          <span style="color: red" v-if="noBank">
            <i class="icon iconfont iconshengming"></i>
            该项目所在的区域暂未设置缴纳银行</span
          >
        </el-form-item>
        <el-form-item
          label="缴纳账号："
          prop="depositAccountId"
          v-if="
            formData.method === 'FUNDDEPOSIT' &&
            (formData.payMethod === 'ALL_PAY' ||
              formData.payMethod === 'PART_PAY')
          "
        >
          <span
            :style="
              formData.account === '通过选择银行带入'
                ? { color: '#999' }
                : { color: '#606266' }
            "
            >{{ formData.account }}</span
          >
        </el-form-item>
        <el-form-item label="应缴金额：" prop="shouldPay">
          <el-radio-group v-model="formDataShouldPay" @change="agreeChange()">
            <el-radio
              v-if="item.depositConfig"
              :label="item.shouldPay + '-' + item.depositConfig.scale"
              :key="index"
              v-for="(item, index) in amountPayableList"
            >
              <span v-if="item.sectionType == 1"
                >{{ item.shouldPay }}元 【
                <span
                  v-for="(items, indexs) in item.depositConfigs"
                  :key="indexs"
                >
                  <span v-if="indexs == 0"
                    >{{ items.max * 10000 }}*{{ items.scale }}%
                    <span v-if="indexs < item.depositConfigs.length - 1"
                      >+</span
                    ></span
                  >
                  <span v-else>
                    <span v-if="item.total&lt;items.max*10000"
                      >({{ item.total }}-{{
                        item.depositConfigs[indexs - 1].max * 10000
                      }})*{{ items.scale }}%
                      <span v-if="indexs < item.depositConfigs.length - 1"
                        >+</span
                      ></span
                    >
                    <span v-else
                      >({{ items.max * 10000 }}-{{ items.min * 10000 }})*{{
                        items.scale
                      }}%
                      <span v-if="indexs < item.depositConfigs.length - 1"
                        >+</span
                      ></span
                    >
                  </span> </span
                >,最高限额{{ item.upperLimit }}元】
              </span>
              <span v-else
                >{{ item.shouldPay }}元({{ item.total }}*{{
                  item.depositConfig.scale
                }}%,最高限额{{ item.depositConfig.upperLimit }}元)</span
              >
            </el-radio>
            <el-radio
              v-else
              :label="item.shouldPay + '-' + item.depositConfigs[0].scale"
              :key="index"
              v-for="(item, index) in amountPayableList"
            >
              <span v-if="item.sectionType == 1"
                >{{ item.shouldPay }}元 【
                <span
                  v-for="(items, indexs) in item.depositConfigs"
                  :key="indexs"
                >
                  <span v-if="indexs == 0"
                    >{{ items.max * 10000 }}*{{ items.scale }}%
                    <span v-if="indexs < item.depositConfigs.length - 1"
                      >+</span
                    ></span
                  >
                  <span v-else>
                    <span v-if="item.total&lt;items.max*10000"
                      >({{ item.total }}-{{
                        item.depositConfigs[indexs - 1].max * 10000
                      }})*{{ items.scale }}%
                      <span v-if="indexs < item.depositConfigs.length - 1"
                        >+</span
                      ></span
                    >
                    <span v-else
                      >({{ items.max * 10000 }}-{{ items.min * 10000 }})*{{
                        items.scale
                      }}%
                      <span v-if="indexs < item.depositConfigs.length - 1"
                        >+</span
                      ></span
                    >
                  </span> </span
                >,最高限额{{ item.upperLimit }}元】
              </span>
              <span v-else
                >{{ item.shouldPay }}元({{ item.total }}*{{
                  item.depositConfigs[0].scale
                }}%,最高限额{{ item.depositConfigs[0].upperLimit }}元)</span
              >
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <template
          v-if="
            formData.method === 'BANKGUARANTEE' ||
            formData.method === 'OWNERPOLICY' ||
            formData.method === 'BANKPOLICY'
          "
        >
          <el-form-item label="担保金额：" prop="payTotal">
            <el-input
              style="position: relative"
              class="sWidth"
              v-model.trim="formData.payTotal"
              placeholder="请输入担保金额"
            ></el-input>
            <span class="moneyUnit">元</span>
          </el-form-item>
          <el-form-item label="担保机构：" prop="guaranteeName">
            <el-input
              maxlength="200"
              class="mWidth"
              v-model.trim="formData.guaranteeName"
              placeholder="请填写担保机构全称"
            ></el-input>
          </el-form-item>
          <el-form-item label="担保生效日：" prop="backLefferStartDate">
            <el-date-picker
              type="date"
              class="sWidth"
              placeholder="请选择保函/担保生效的日期"
              v-model="formData.backLefferStartDate"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label="担保到期日：" prop="backLefferEndDate">
            <el-date-picker
              type="date"
              class="sWidth"
              placeholder="请选择保函/担保到期的日期"
              v-model="formData.backLefferEndDate"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </template>
        <template
          v-else-if="
            formData.method === 'FUNDDEPOSIT' &&
            formData.payMethod === 'PART_PAY'
          "
        >
          <el-form-item label="减免金额：" prop="reduceMoney">
            <el-input
              style="position: relative"
              class="sWidth"
              @blur.prevent="changeCount()"
              v-model.trim="formData.reduceMoney"
              placeholder="请输入减免金额"
            ></el-input>
            <span class="moneyUnit">元</span>
          </el-form-item>
          <el-form-item label="实缴金额：">
            <span class="shouldTotal">{{ calculatePayTotal }}元</span>
          </el-form-item>
        </template>
        <template
          v-else-if="
            formData.method === 'FUNDDEPOSIT' &&
            formData.payMethod === 'ALL_NO_PAY'
          "
        >
          <el-form-item label="免缴金额：">
            <span class="shouldTotal">{{ formData.shouldPay }}元</span>
          </el-form-item>
        </template>
        <template
          v-else-if="
            formData.method === 'FUNDDEPOSIT' &&
            formData.payMethod === 'ALL_PAY'
          "
        >
          <el-form-item label="实缴金额：" prop="payTotal">
            <el-input
              style="position: relative"
              class="sWidth"
              v-model.trim="formData.payTotal"
              placeholder="请输入实缴金额"
            ></el-input>
            <span class="moneyUnit">元</span>
          </el-form-item>
        </template>
        <el-form-item label="业务办理人：" prop="operator">
          <el-input
            maxlength="10"
            class="sWidth"
            v-model.trim="formData.operator"
            placeholder="请填写业务实际处理人员姓名"
          ></el-input>
        </el-form-item>
        <template
          v-if="
            formData.method === 'FUNDDEPOSIT' &&
            (formData.payMethod === 'PART_PAY' ||
              formData.payMethod === 'ALL_NO_PAY' ||
              formData.payMethod === 'WAIT_PAY')
          "
        >
          <el-form-item
            :label="
              formData.payMethod === 'PART_PAY'
                ? '减免原因：'
                : formData.payMethod === 'ALL_NO_PAY'
                ? '免缴原因：'
                : '缓缴原因：'
            "
            prop="reduceRemark"
          >
            <el-input
              type="textarea"
              rows="5"
              style="width: calc(88% - 14px)"
              v-model.trim="formData.reduceRemark"
              autocomplete="off"
              :placeholder="
                formData.payMethod === 'PART_PAY'
                  ? '请填写保证金减免原因'
                  : formData.payMethod === 'ALL_NO_PAY'
                  ? '请填写保证金免缴原因'
                  : '请填写缓缴原因'
              "
              maxlength="200"
            ></el-input>
          </el-form-item>
          <el-form-item
            :label="
              formData.payMethod === 'PART_PAY'
                ? '减免凭证：'
                : formData.payMethod === 'ALL_NO_PAY'
                ? '免缴凭证：'
                : '缓缴凭证：'
            "
            prop="reducePayImg"
          >
            <uploadAnnex
              @getFileList="getFileList"
              :limitationFactor="limitationFactor"
              @getFile="getFile"
              :upLoadFile="upLoadFile"
            />
          </el-form-item>
          <div
            id="cutRule"
            ref="imageWrapper"
            v-show="
              (formData.payMethod === 'PART_PAY' ||
                formData.payMethod === 'ALL_NO_PAY') &&
              openCut &&
              (!forBird || !forbidThree) &&
              loginType == 'XM'
            "
          >
            <div class="title">保证金减免凭证</div>
            <table
              border="1"
              cellspacing="0"
              cellpadding="0"
              style="width: 100%"
            >
              <tr>
                <td>日期</td>
                <td>{{ cutRulesDetail.Date }}</td>
                <td>评价等级</td>
                <td>{{ cutRulesDetail.projectLevel }}</td>
              </tr>
              <tr>
                <td>减免比例</td>
                <td>{{ cutRulesDetail.percent }}</td>
                <td>可减免金额</td>
                <td>{{ cutRulesDetail.freePay }}元</td>
              </tr>
            </table>
          </div>
          <div
            id="cutRuleHG"
            ref="imageWrapperHG"
            v-show="
              formData.payMethod === 'WAIT_PAY' &&
              showWaitPay &&
              loginType == 'XM'
            "
          >
            <div class="title">保证金缓缴凭证</div>
            <table border="1" cellspacing="0" cellpadding="0">
              <tr>
                <td>日期</td>
                <td>{{ HGInfo.date }}</td>
                <td>评价等级</td>
                <td>{{ HGInfo.projectLevel }}</td>
              </tr>
              <tr>
                <td>缓缴周期</td>
                <td colspan="3">{{ HGInfo.wayPayCycle }}</td>
              </tr>
            </table>
          </div>
          <el-row v-model="formData.contractImgUrl">
            <uploadResult
              style="margin-left: 120px"
              :resultList="upLoadFile"
              @callBackResult="getFile"
            />
          </el-row>
        </template>
        <template v-else>
          <el-form-item label="缴纳原因：" prop="remark">
            <el-input
              type="textarea"
              rows="5"
              style="width: calc(88% - 14px)"
              v-model.trim="formData.remark"
              autocomplete="off"
              placeholder="请填写缴纳备注信息"
              maxlength="200"
            ></el-input>
          </el-form-item>
        </template>
        <!--黄石地区 缴纳形式为【资金存入】，在缴纳凭证字段上方，需新增付款银行账户信息填写表单 -->
        <div v-if="isHsUser() && formData.method === 'FUNDDEPOSIT'">
          <el-form-item label="付款银行账户：" prop="remark">
            <p class="formItemTip">
              填写企业付款银行账号，不支持个人账户转账，后期保证金退还将原路退回
            </p>
          </el-form-item>
          <el-form-item label="开户银行：">
            <el-input
              v-model.trim="formData.institution"
              class="sWidth"
              autocomplete="off"
              placeholder="请输入付款账户开户银行"
            ></el-input>
          </el-form-item>
          <el-form-item label="支行名称：">
            <el-input
              v-model.trim="formData.branch"
              class="sWidth"
              autocomplete="off"
              placeholder="请输入支行名称"
            ></el-input>
          </el-form-item>
          <el-form-item label="账户名称：">
            <el-input
              v-model.trim="formData.name"
              class="sWidth"
              autocomplete="off"
              placeholder="请输入账户名称"
            ></el-input>
          </el-form-item>
          <el-form-item label="银行卡号：">
            <el-input
              v-model.trim="formData.cardCode"
              class="sWidth"
              autocomplete="off"
              placeholder="请输入银行卡号"
            ></el-input>
          </el-form-item>
        </div>
        <!--黄石地区 缴纳形式为【银行保函】或【保险保单】 需新增填写寄件信息-->
        <div
          v-if="
            isHsUser() &&
            ['BANKGUARANTEE', 'BANKPOLICY'].includes(formData.method)
          "
        >
          <el-form-item label="寄件信息：" prop="remark">
            <p class="formItemTip">
              企业需要提前将保函或保单快递至劳动监察部门，查看
              <el-link @click="downLoadFile('sendFiles')">收件信息</el-link>
            </p>
            <p class="formItemTip">请在寄件后填写寄件人信息</p>
          </el-form-item>
          <el-form-item label="寄件人姓名：">
            <el-input
              v-model.trim="formData.institution"
              class="sWidth"
              autocomplete="off"
              placeholder="请输入寄件人姓名"
            ></el-input>
          </el-form-item>
          <el-form-item label="联系电话：">
            <el-input
              v-model.trim="formData.branch"
              class="sWidth"
              autocomplete="off"
              placeholder="请输入联系电话"
            ></el-input>
          </el-form-item>
          <el-form-item label="快递公司：">
            <el-input
              v-model.trim="formData.name"
              class="sWidth"
              autocomplete="off"
              placeholder="请输入快递公司名称"
            ></el-input>
          </el-form-item>
          <el-form-item label="快递单号：">
            <el-input
              v-model.trim="formData.cardCode"
              class="sWidth"
              autocomplete="off"
              placeholder="请输入快递单号"
            ></el-input>
          </el-form-item>
          <el-form-item label="寄件凭证：">
            <uploadAnnex
              @getFileList="getExpressFileList"
              :limitationFactor="limitationExpress"
              @getFile="getExpressFile"
              :upLoadFile="expressFile"
            />
          </el-form-item>
          <el-row v-model="formData.senderFileJson">
            <uploadResult
              style="margin-left: 120px"
              :resultList="expressFile"
              @callBackResult="getExpressFile"
            />
          </el-row>
        </div>
        <!-- 非资金存入及资金存入全额缴纳/部分缴纳有缴纳凭证 -->
        <template
          v-if="
            formData.method !== 'FUNDDEPOSIT' ||
            (formData.method === 'FUNDDEPOSIT' &&
              (formData.payMethod === 'ALL_PAY' ||
                formData.payMethod === 'PART_PAY'))
          "
        >
          <el-form-item
            :label="
              isHsUser() &&
              ['BANKGUARANTEE', 'BANKPOLICY'].includes(formData.method)
                ? '保单保函：'
                : '缴纳凭证：'
            "
            prop="contractImgUrl"
          >
            <uploadAnnex
              @getFileList="getFileListPay"
              :limitationFactor="limitationFactorPay"
              @getFile="getFilePay"
              :upLoadFile="uploadPayFile"
            />
          </el-form-item>
          <el-row v-model="formData.contractImgUrl">
            <uploadResult
              style="margin-left: 120px"
              :resultList="uploadPayFile"
              @callBackResult="getFilePay"
            />
          </el-row>
        </template>
        <el-form-item
          v-if="
            isHsUser() &&
            ['BANKGUARANTEE', 'BANKPOLICY'].includes(formData.method)
          "
          label=""
          label-width="20px"
        >
          <el-checkbox v-model="formData.checked"
            >勾选即代表同意
            <el-link @click="downLoadFile('constructionFiles')"
              >施工单位承诺书</el-link
            ></el-checkbox
          >
        </el-form-item>
        <el-form-item class="operateBtns">
          <el-button
            class="commonBut saveBtn"
            type="primary"
            @click="saveToDetail"
            :loading="isSaveLoading"
            >申报</el-button
          >
          <el-button class="commonBut" @click="goBack">取消</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
import html2canvas from 'html2canvas'
export default {
  name: 'cashDepositAdd',

  data() {
    var checkMoney = (rule, value, callback) => {
      if (!value) {
        if (
          this.formData.method === 'BANKGUARANTEE' ||
          this.formData.method === 'OWNERPOLICY' ||
          this.formData.method === 'BANKPOLICY'
        ) {
          return callback(new Error('担保金额不能为空'))
        } else if (
          this.formData.method === 'FUNDDEPOSIT' &&
          this.formData.payMethod === 'ALL_PAY'
        ) {
          return callback(new Error('实缴金额不能为空'))
        }
      } else {
        var rePayTotal =
          /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/
        if (!rePayTotal.test(value) || value == 0.0 || value == 0.0) {
          callback(new Error('金额格式不正确,必须大于0,最多带有2位小数'))
        } else {
          if (value >= 100000000000) {
            callback(new Error('金额需小于1000亿'))
          } else {
            callback()
          }
        }
      }
    }
    var checkMoneyReduce = (rule, value, callback) => {
      let shouldPay = this.formDataShouldPay.split('-')[0]
      if (!value) {
        return callback(new Error('减免金额不能为空'))
      } else {
        var rePayTotal =
          /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/
        if (!rePayTotal.test(value) || value == 0.0 || value == 0.0) {
          callback(new Error('金额格式不正确,必须大于0,最多带有2位小数'))
        } else if (!shouldPay) {
          callback(new Error('请先选择应缴金额'))
        } else if (
          shouldPay &&
          (Number(value) > Number(shouldPay) ||
            Number(value) == Number(shouldPay))
        ) {
          callback(new Error('减免金额需小于应缴金额'))
        } else {
          if (
            this.loginType == 'XM' &&
            value > this.cutRules * 1 &&
            this.openCut
          ) {
            callback(new Error(`当前最高可减免${this.cutRules}元`))
            // this.formData.reduceMoney = 0
            // this.changeCount()
          } else {
            callback()
          }
        }
      }
    }
    var checkShouldPay = (rule, value, callback) => {
      if (!this.formDataShouldPay) {
        return callback(new Error('应缴金额不能为空'))
      } else {
        callback()
      }
    }
    var checkPayDate = (rule, value, callback) => {
      if (!value) {
        if (
          this.formData.method === 'FUNDDEPOSIT' &&
          this.formData.payMethod === 'WAIT_PAY'
        ) {
          return callback(new Error('缓缴日期不能为空'))
        } else if (this.formData.method === 'WAIT_PAY') {
          callback()
        }
      } else {
        callback()
      }
    }
    var checkDate = (rule, value, callback) => {
      var backLefferStartDate = this.formData.backLefferStartDate
      var backLefferEndDate = this.formData.backLefferEndDate
      if (!backLefferEndDate) {
        return callback(new Error('保函/担保到期的日期不能为空'))
      } else if (backLefferStartDate > backLefferEndDate) {
        return callback(new Error('担保到期日不能小于担保生效日'))
      } else {
        callback()
      }
    }
    //缴纳凭证验证
    var checkPayUploadFile = (rule, value, callback) => {
      if (this.uploadPayFile.length === 0) {
        if (
          this.isHsUser() &&
          ['BANKGUARANTEE', 'BANKPOLICY'].includes(this.formData.method)
        ) {
          return callback(new Error('保单保函不能为空'))
        } else {
          return callback(new Error('缴纳凭证不能为空'))
        }
      } else {
        callback()
      }
    }
    var checkExpressFile = (rule, value, callback) => {
      if (this.expressFile.length === 0) {
        return callback(new Error('寄件凭证不能为空'))
      } else {
        callback()
      }
    }
    var checkReason = (rule, value, callback) => {
      if (!value && this.formData.method === 'FUNDDEPOSIT') {
        if (this.formData.payMethod === 'PART_PAY') {
          return callback(new Error('减免原因不能为空'))
        } else if (this.formData.payMethod === 'ALL_NO_PAY') {
          return callback(new Error('免缴原因不能为空'))
        } else if (this.formData.payMethod === 'WAIT_PAY') {
          return callback(new Error('缓缴原因不能为空'))
        }
      } else {
        callback()
      }
    }
    var checkUploadFileReduce = (rule, value, callback) => {
      if (this.upLoadFile.length === 0) {
        if (this.formData.method === 'FUNDDEPOSIT') {
          if (this.formData.payMethod === 'PART_PAY') {
            return callback(new Error('减免凭证不能为空'))
          } else if (this.formData.payMethod === 'ALL_NO_PAY') {
            return callback(new Error('免缴凭证不能为空'))
          } else if (this.formData.payMethod === 'WAIT_PAY') {
            return callback(new Error('缓缴凭证不能为空'))
          }
        }
      } else {
        callback()
      }
    }
    return {
      newImg: '',
      cutRules: 0,
      cutRulesDetail: {},
      currentObjAreaId: '',
      currentObjTotal: '',
      show: false,
      titleText: '添加保证金缴纳记录',
      formDataShouldPay: '',
      back: true,
      projectOptions: [], //项目名称下拉框
      companyOptions: [], //缴纳单位
      bankNameList: [],
      calculatePayTotal: '', //部分免缴计算的实缴
      formData: {
        projectName: '',
        projectJson: '',
        projectId: '', //项目名称
        method: 'FUNDDEPOSIT', //缴纳方式
        payMethod: 'ALL_PAY', //缴纳形式
        reciveunit: '', //缴纳单位
        operationDate: '', //缴纳日期
        backLefferStartDate: '', //担保生效日
        backLefferEndDate: '', //担保到期日
        bankOne: '', //缴纳银行
        bankName: '',
        account: '通过选择银行带入', //缴纳账号
        shouldPay: '', //应缴金额
        total: '', //工程造价
        scale: '', //工程造价比例
        upperLimit: '', //最高限额
        reduceMoney: '', //减免金额
        payTotal: '', //实缴金额
        guaranteeName: '', //担保机构
        operator: '', //业务办理人
        remark: '', //缴纳原因
        reduceRemark: '', //减免原因
        contractImgUrl: [], //合同附件
      },
      noBank: false,
      upLoadFile: [], //附件
      cardFile: [],
      srcList: [],
      oldSrcList: [],
      uploadPayFile: [],
      paySrcList: [],
      oldPaySrcList: [],
      //验证
      formRules: {
        method: [
          {
            required: true,
            message: '请选择缴纳方式',
            trigger: ['blur', 'change'],
          },
        ],
        payMethod: [
          {
            required: true,
            message: '请选择缴纳形式',
            trigger: ['blur', 'change'],
          },
        ],
        reciveunit: [
          {
            required: true,
            message: '请选择缴纳单位',
            trigger: 'change',
          },
        ],
        operationDate: [
          {
            required: true,
            // message: "日期不能为空",
            validator: checkPayDate,
            trigger: 'change',
          },
        ],
        bankOne: [
          {
            required: true,
            message: '请选择缴纳银行',
            trigger: 'change',
          },
        ],
        operator: [
          {
            // pattern: /^[^\u4e00-\u9fa5]{0,}$/,
            pattern: /^[\u4e00-\u9fa5]+$/,
            message: '只能输入汉字',
            trigger: 'blur',
          },
        ],
        reduceMoney: [
          {
            required: true,
            validator: checkMoneyReduce,
            // message: "减免金额不能为空",
            trigger: 'blur',
          },
        ],
        payTotal: [
          {
            required: true,
            validator: checkMoney,
            trigger: 'blur',
          },
        ],
        shouldPay: [
          {
            required: true,
            validator: checkShouldPay,
            // message: "应缴金额不能为空",
            trigger: 'blur',
          },
        ],
        guaranteeName: [
          {
            required: true,
            message: '担保机构不能为空',
            trigger: 'blur',
          },
        ],
        backLefferStartDate: [
          {
            required: true,
            message: '保函/担保生效的日期不能为空',
            trigger: 'change',
          },
        ],
        backLefferEndDate: [
          {
            required: true,
            validator: checkDate,
            // message: "保函/担保到期的日期不能为空",
            trigger: 'change',
          },
        ],
        reduceRemark: [
          {
            required: true,
            // message: "原因不能为空",
            validator: checkReason,
            trigger: 'blur',
          },
        ],
        reducePayImg: [
          {
            required: true,
            validator: checkUploadFileReduce,
            trigger: 'change',
          },
        ],
        contractImgUrl: [
          {
            required: true,
            // message: "缴纳凭证不能为空",
            validator: checkPayUploadFile,
            trigger: 'change',
          },
        ],
      },
      isSaveLoading: false, // 保存loading
      total: 0,
      amountPayableList: [],
      showForm: true, //重新渲染表单，避免验证问题
      limitationFactor: {
        uploadAnnexUrl: 'api-f/files/upload', //自定义上传文件接口地址
        upLoadFileLength: 10, //自定义上传附件的个数设置
        fileSize: 5, //自定义上传文件最大设置
        formatType: 'typeFour', //自定义上传格式校验类型
        fileId: 'salaryExcel', //自定义id解决一个页面包含多个上传附件
        uploadFormId: 'salaryExcelForm', //自定义id解决一个页面包含多个上传附件
        messagetip:
          '要求格式为png，jpg，jpeg，doc，docx，xls，xlsx，pdf格式，附件大小不超过5M', //自定义报错提示语
        methodTip:
          '请上传缴款回执单，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件', //自定义上传文件提示
        uploadBtnType: 'typeOne', //自定义上传按钮类型
      },
      limitationFactorPay: {
        uploadAnnexUrl: 'api-f/files/upload', //自定义上传文件接口地址
        upLoadFileLength: 10, //自定义上传附件的个数设置
        fileSize: 5, //自定义上传文件最大设置
        formatType: 'typeFour', //自定义上传格式校验类型
        fileId: 'salaryExcel1', //自定义id解决一个页面包含多个上传附件
        uploadFormId: 'salaryExcelForm1', //自定义id解决一个页面包含多个上传附件
        messagetip:
          '要求格式为png，jpg，jpeg，doc，docx，xls，xlsx，pdf格式，附件大小不超过5M', //自定义报错提示语
        methodTip:
          '请上传缴款回执单，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件', //自定义上传文件提示
        uploadBtnType: 'typeOne', //自定义上传按钮类型
      },
      maxShouldPay: 0,
      cutSwitch: true,
      showWaitPay: false, //显示缓缴
      operationDate: [],
      HGInfo: {},
      loginType: '',
      openCut: false, //配置打开的时候才使用减免规则
      openHG: false,

      checkExpressFile,
      expressFile: [],
      expressSrcList: [],
      oldExpressSrcList: [],
      limitationExpress: {
        uploadAnnexUrl: 'api-f/files/upload', //自定义上传文件接口地址
        upLoadFileLength: 10, //自定义上传附件的个数设置
        fileSize: 5, //自定义上传文件最大设置
        formatType: 'typeFour', //自定义上传格式校验类型
        fileId: 'salaryExcel2', //自定义id解决一个页面包含多个上传附件
        uploadFormId: 'salaryExcelForm2', //自定义id解决一个页面包含多个上传附件
        messagetip:
          '要求格式为png，jpg，jpeg，doc，docx，xls，xlsx，pdf格式，附件大小不超过5M', //自定义报错提示语
        methodTip:
          '请上寄件凭证，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件', //自定义上传文件提示
        uploadBtnType: 'typeOne', //自定义上传按钮类型
      },
    }
  },
  created() {
    this.loginType = localStorage.getItem('loginType')
    this.formData.projectName = this.$route.query.projectName
    this.formData.projectId = this.$route.query.projectId
    //项目名称下拉框
    this.getProjectList()
    if (this.isHsUser()) {
      this.$set(this.formData, 'institution', '')
      this.$set(this.formData, 'branch', '')
      this.$set(this.formData, 'name', '')
      this.$set(this.formData, 'cardCode', '')
      this.$set(this.formRules, 'institution', [
        { required: true, message: '请输入开户银行', trigger: 'blur' },
        {
          required: true,
          min: 1,
          max: 10,
          message: '支持输入1-10个字符',
          trigger: 'blur',
        },
      ])
      this.$set(this.formRules, 'branch', [
        { required: true, message: '请输入支行名称', trigger: 'blur' },
        {
          required: true,
          min: 1,
          max: 30,
          message: '支持输入1-30个字符',
          trigger: 'blur',
        },
      ])
      this.$set(this.formRules, 'name', [
        { required: true, message: '请输入账户名称', trigger: 'blur' },
        {
          required: true,
          min: 1,
          max: 30,
          message: '支持输入1-30个字符',
          trigger: 'blur',
        },
      ])
      this.$set(this.formRules, 'cardCode', [
        { required: true, message: '请输入银行卡号', trigger: 'blur' },
        {
          required: true,
          pattern: /^[\d\-\(\)\ ]{7,30}$/,
          message: '只能输入7-30位数字',
          trigger: 'blur',
        },
      ])
    }
  },
  computed: {
    forBird() {
      if (this.cutRules == 0 || this.cutRules == '0.00') {
        return true
      }
      return false
    },
    forbidThree() {
      if (
        this.cutRules == 0 ||
        this.cutRules == '0.00' ||
        this.cutRules * 1 < this.maxShouldPay
      ) {
        return true
      }
      return false
    },
  },
  methods: {
    getExpressFileList(val) {
      this.expressSrcList.push(val)
      this.oldExpressSrcList.push(val)
    },

    getExpressFile(val) {
      this.expressFile = val
    },
    downLoadFile(type) {
      this.axios({
        method: 'post',
        url: 'api-p/deposit/expand/findurl',
        data: {
          type: type,
        },
      })
        .then(
          (response) => {
            if (!response.data.hasError) {
              window.open(response.data.result.url)
            } else {
              this.$message({
                type: 'error',
                message: response.data.msg,
              })
            }
          },
          (response) => {}
        )
        .catch((error) => {})
    },
    toImage() {
      if (this.$refs.imageWrapper) {
        html2canvas(this.$refs.imageWrapper).then((canvas) => {
          let dataURL = canvas.toDataURL('image/png')
          this.newImg = dataURL
          this.axios
            .post('api-f/files/upload/base64', { image64: dataURL })
            .then((res) => {
              let obj = res.data
              obj.name = '保证金减免凭证.jpg'
              obj.id = new Date().getTime()
              this.$set(this.upLoadFile, 0, obj)
              this.getFileList(obj.url)
              this.getFile([obj])
            })
          document.getElementById('cutRule').style.display = 'none'
          this.formData.reduceRemark = ''
        })
      }
    },
    toImageHG() {
      if (this.$refs.imageWrapperHG) {
        html2canvas(this.$refs.imageWrapperHG).then((canvas) => {
          let dataURL = canvas.toDataURL('image/png')
          this.newImg = dataURL
          this.axios
            .post('api-f/files/upload/base64', { image64: dataURL })
            .then((res) => {
              let obj = res.data
              obj.name = '保证金缓缴凭证.jpg'
              obj.id = new Date().getTime()
              this.$set(this.upLoadFile, 0, obj)
              this.getFileList(obj.url)
              this.getFile([obj])
            })
          document.getElementById('cutRuleHG').style.display = 'none'
          this.formData.reduceRemark =
            '根据保证金缓缴制度，项目符合保证金缓缴条件'
        })
      }
    },
    //获取可减免金额
    getCutRules(shouldPay) {
      let params = {
        areaId: this.$store.state.projectAreaId,
        projectId: this.formData.projectId,
        shouldPay,
      }
      this.axios
        .post('api-d/depositpayconfig/expand/checkTip', params)
        .then((res) => {
          if (!res.data.hasError) {
            this.openCut = true
            this.maxShouldPay = shouldPay
            this.cutRules = res.data.result.freePayTotal
            if (this.cutRules * 1 > 0) {
              this.formData.reduceRemark =
                '根据保证金减免制度，符合保证金减免条件'
            }
          } else {
            this.openCut = false
          }
        })
    },
    //获取缓缴凭证数据
    getHuanData(startDate) {
      let params = {
        areaId: this.$store.state.projectAreaId,
        projectId: this.formData.projectId,
        startDate,
      }
      this.axios
        .post('api-d/depositpayconfig/expand/findWaitPayFileData', params)
        .then((res) => {
          if (!res.data.hasError) {
            this.showWaitPay = true
            this.HGInfo = res.data.result
            let obj = res.data.result.wayPayCycle.split('至')
            this.operationDate = [obj[0], obj[1]]
          } else {
            this.showWaitPay = false
            if (res.data.errorMsg == '该区域保证金缓缴配置已关闭') {
              this.cutSwitch = false
            }
          }
        })
    },
    getCuteData(shouldPay) {
      let params = {
        areaId: this.$store.state.projectAreaId,
        projectId: this.formData.projectId,
        shouldPay,
      }
      this.axios
        .post('api-d/depositpayconfig/expand/getFreePayFileData', params)
        .then((res) => {
          if (!res.data.hasError) {
            this.cutRulesDetail = res.data.result
          }
        })
    },
    /**
     * @description: 应缴金额选择
     */
    agreeChange() {
      this.changeCount()
      this.formData.shouldPay = this.formDataShouldPay.split('-')[0]
    },
    /**
     * @description: 获取上传的附件
     */
    getFileList(val) {
      console.log(val)
      this.oldSrcList.push(val)
      this.srcList.push(val)
    },
    /**
     * @description: 获取上传的附件
     */
    getFile(val) {
      console.log(val)
      this.upLoadFile = val
    },
    selectChange(val) {
      //手动输入掉接口会清空问题下拉框的值，掉完接口再赋值
      this.projectSelect = val
      this.getProjectList(1, this.pageSizeNumber, val)
      if (typeof this.formData.projectId === 'string') {
        this.formData.projectId = val
      }
      this.formData.projectId = val
      // alert(val)
    },
    handleCurrentChange(val) {
      this.getProjectList(val, this.pageSizeNumber, this.projectSelect)
    },
    getProjectList(pageNo, pageSizeNumber, val) {
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/list',
        data: {
          pageNo: 1,
          pageSize: 20,
          projectId: this.formData.projectId,
          projectName: this.formData.projectName,
          isSa: '',
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.projectOptions = response.data.result.results
            if (this.loginType == 'XM') {
              this.getHuanData(
                this.projectOptions[0].projectStartDate.split('-').join('/')
              )
            }

            this.total = response.data.result.total
            this.$nextTick(() => {
              var currentObj = this.projectOptions[0]
              this.formData.projectJson = currentObj
              if (currentObj) {
                ;(this.currentObjAreaId = currentObj.areaId),
                  (this.currentObjTotal = currentObj.total),
                  this.companyOptions.push(
                    {
                      companyName: currentObj.pcName,
                      companyType: '0', //建设方
                    },
                    {
                      companyName: currentObj.pbName,
                      companyType: '5', //施工方
                    }
                  )
                this.getBankNameList(currentObj.areaId)
                this.getCountShould(
                  currentObj.areaId,
                  currentObj.total,
                  this.formData.method
                )
                this.verifyIsExesit(currentObj.projectId)
              }
            })
          }
        })
        .catch((error) => {})
    },
    verifyIsExesit(projectId) {
      this.axios({
        method: 'post',
        url: 'api-d/deposit/expand/exist',
        data: {
          projectId: projectId,
        },
      })
        .then((response) => {
          if (!response.data.result === true) {
          } else {
            this.$message({
              showClose: true,
              duration: 3000,
              message: '保证金已存在',
              type: 'error',
            })
            return
          }
        })
        .catch((error) => {})
    },
    getCountShould(areaId, total, depositType) {
      this.axios({
        method: 'post',
        url: 'api-d/deposit/expand/countshould',
        data: {
          areaId: areaId,
          total: total,
          depositType: depositType,
        },
      })
        .then((response) => {
          var data = response.data
          if (!data.hasError) {
            var result = response.data.result
            this.amountPayableList = response.data.result

            if (this.loginType == 'XM') {
              this.getCutRules(response.data.result[0].shouldPay)
              this.getCuteData(response.data.result[0].shouldPay)
            }
          }
        })
        .catch((error) => {})
    },
    getBankNameList(areaId) {
      this.axios({
        method: 'post',
        url: 'api-d/account/expand/finddprobank',
        data: {
          areaId: areaId,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            var data = response.data.result
            if (data.length > 0) {
              this.noBank = false
              this.bankNameList = data
            } else {
              this.noBank = true
            }
          }
        })
        .catch((error) => {})
    },
    changeBankName(val) {
      // 获取选中的银行卡号
      var bankOne = val.split(',')
      this.formData.bankId = bankOne[0]
      this.formData.account = bankOne[1]
      this.formData.bankName = bankOne[2]
    },
    payTypeChange(val) {
      this.showFileText()
      console.log(val)
      if (this.isHsUser()) {
        this.expressFile = []
        this.uploadPayFile = []
        if (val === 'FUNDDEPOSIT') {
          delete this.formData.senderFileJson
          delete this.formRules.senderFileJson
          delete this.formRules.checked
          this.$set(this.formRules, 'institution', [
            { required: true, message: '请输入开户银行', trigger: 'blur' },
            {
              required: true,
              min: 1,
              max: 10,
              message: '支持输入1-10个字符',
              trigger: 'blur',
            },
          ])
          this.$set(this.formRules, 'branch', [
            { required: true, message: '请输入支行名称', trigger: 'blur' },
            {
              required: true,
              min: 1,
              max: 30,
              message: '支持输入1-30个字符',
              trigger: 'blur',
            },
          ])
          this.$set(this.formRules, 'name', [
            { required: true, message: '请输入账户名称', trigger: 'blur' },
            {
              required: true,
              min: 1,
              max: 30,
              message: '支持输入1-30个字符',
              trigger: 'blur',
            },
          ])
          this.$set(this.formRules, 'cardCode', [
            { required: true, message: '请输入银行卡号', trigger: 'blur' },
            {
              required: true,
              pattern: /^[\d\-\(\)\ ]{7,30}$/,
              message: '只能输入7-30位数字',
              trigger: 'blur',
            },
          ])
        } else if (['BANKGUARANTEE', 'BANKPOLICY'].includes(val)) {
          this.$set(this.formRules, 'institution', [
            { required: true, message: '请输入寄件人姓名', trigger: 'blur' },
            {
              required: true,
              min: 1,
              max: 20,
              message: '支持输入1-20个字符',
              trigger: 'blur',
            },
          ])
          this.$set(this.formRules, 'branch', [
            { required: true, message: '请输入寄件人电话', trigger: 'blur' },
            {
              required: true,
              pattern: /^[\d\-\(\)\ ]{7,11}$/,
              message: '只能输入7-11位数字',
              trigger: 'blur',
            },
          ])
          this.$set(this.formRules, 'name', [
            { required: true, message: '请输入快递公司', trigger: 'blur' },
            {
              required: true,
              min: 1,
              max: 10,
              message: '支持输入1-10个字符',
              trigger: 'blur',
            },
          ])
          this.$set(this.formRules, 'cardCode', [
            { required: true, message: '请输入快递单号', trigger: 'blur' },
            {
              required: true,
              min: 1,
              max: 30,
              message: '支持输入1-30个字符',
              trigger: 'blur',
            },
          ])
          this.$set(this.formData, 'senderFileJson', [])
          this.$set(this.formData, 'checked', false)
          this.$set(this.formRules, 'senderFileJson', [
            {
              required: true,
              validator: this.checkExpressFile,
              trigger: 'change',
            },
          ])
        }
      }
      this.showForm = false
      // 重置验证不重置表单内容
      this.$nextTick(() => {
        this.showForm = true
        // this.$refs.formData.clearValidate();
      })
      this.upLoadFile = []
      if (
        this.formData.payMethod == 'WAIT_PAY' &&
        this.loginType == 'XM' &&
        this.showWaitPay
      ) {
        this.toImageHG()
      }
      if (
        (this.formData.payMethod == 'PART_PAY' ||
          this.formData.payMethod == 'ALL_NO_PAY') &&
        this.loginType == 'XM' &&
        this.openCut
      ) {
        this.getCountShould(
          this.currentObjAreaId,
          this.currentObjTotal,
          this.formData.method
        )
        this.toImage()
      }
    },
    submitFormUptate(params) {
      this.isSaveLoading = true
      //资金存入
      var fundDeposit = this.formData.method === 'FUNDDEPOSIT'
      var allPay = this.formData.payMethod === 'ALL_PAY'
      var partPay = this.formData.payMethod === 'PART_PAY'
      var allNoPay = this.formData.payMethod === 'ALL_NO_PAY'
      var waitPay = this.formData.payMethod === 'WAIT_PAY'
      var fileJson, exemptionAccount, payTotal
      if (fundDeposit && (partPay || allNoPay || waitPay)) {
        fileJson = JSON.stringify(this.upLoadFile)
      } else {
        fileJson = JSON.stringify(this.uploadPayFile)
      }
      // 减免金额和全额免缴 都传 exemptionAccount
      if (fundDeposit && partPay) {
        exemptionAccount = this.formData.reduceMoney
      } else if (fundDeposit && allNoPay) {
        exemptionAccount = this.formData.shouldPay
      } else {
        exemptionAccount = ''
      }
      //1.全额免缴和缓缴没有实缴金额   2.部分免缴中 实缴由计算得出
      if (fundDeposit && (allNoPay || waitPay)) {
        if (allNoPay) {
          payTotal = ''
        }
        if (waitPay) {
          payTotal = 0
        }
      } else if (fundDeposit && partPay) {
        payTotal = this.calculatePayTotal
      } else {
        payTotal = this.formData.payTotal
      }
      var data = {
        projectJson: JSON.stringify(this.formData.projectJson),
        companyType: this.formData.reciveunit,
        method: this.formData.method,
        // 资金存入-缴纳形式
        payMethod: fundDeposit ? this.formData.payMethod : '',
        operationDateString: this.formData.operationDate,
        // 资金存入-（全额缴纳/部分免缴）存在缴纳银行和缴纳账号信息
        bankId: fundDeposit && (allPay || partPay) ? this.formData.bankId : '',
        bankName:
          fundDeposit && (allPay || partPay) ? this.formData.bankName : '',
        account:
          fundDeposit && (allPay || partPay) ? this.formData.account : '',
        // shouldPayTotal: this.formData.shouldPay,
        // payScale: this.formData.scale, //后台新增字段
        shouldPayTotal: this.formDataShouldPay.split('-')[0],
        payScale: this.formDataShouldPay.split('-')[1], //后台新增字段
        // 全额免缴和缓缴没有实缴金额
        payTotal: payTotal, //实缴金额
        exemptionAccount: exemptionAccount,
        //非资金存入 担保机构，担保生效日，担保失效日
        guaranteeName: fundDeposit ? '' : this.formData.guaranteeName,
        guaranteeStartDateString: fundDeposit
          ? ''
          : this.formData.backLefferStartDate,
        guaranteeEndDateString: fundDeposit
          ? ''
          : this.formData.backLefferEndDate,
        operator: this.formData.operator,
        //部分免缴，全额免缴，缓缴 原因为必填项
        remark:
          fundDeposit && (partPay || allNoPay || waitPay)
            ? this.formData.reduceRemark
            : this.formData.remark,
        // 部分免缴的    缴纳凭证用noAllPayFileJson  其他凭证名字都用fileJson
        //减免凭证，缓缴凭证，缓缴凭证
        noAllPayFileJson:
          fundDeposit && partPay ? JSON.stringify(this.uploadPayFile) : [],
        //缴纳凭证
        // 非资金存入及资金存入全额缴纳/部分缴纳有缴纳凭证
        fileJson: fileJson,
      }
      if (waitPay) {
        data.waitPayCycle = this.operationDate[0] + '至' + this.operationDate[1]
      }
      // 黄石地区 添加另外的4个参数

      if (this.isHsUser()) {
        data.institution = this.formData.institution
        data.branch = this.formData.branch
        data.name = this.formData.name
        data.cardCode = this.formData.cardCode

        if (['BANKGUARANTEE', 'BANKPOLICY'].includes(this.formData.method)) {
          data.senderFileJson = JSON.stringify(this.expressFile)
          data.isConfirm = this.formData.checked ? 1 : 0
        }
      }
      this.axios({
        method: 'post',
        url: 'api-d/deposit/expand/adddeposit',
        data: data,
      })
        .then((response) => {
          this.isSaveLoading = false
          if (!response.data.hasError) {
            this.$message({
              message: '保存成功',
              type: 'success',
            })
            this.$router.push({
              path: '/home/cashDeposit/cashDepositList',
              name: 'cashDepositList',
              query: {
                projectId: this.formData.projectId,
                projectName: this.formData.projectName,
                depositId: response.data.result.id, //后台返回的保证金id
                method: this.formData.method, //根据缴纳方式和缴纳形式确定页面样式
                payMethod: fundDeposit ? this.formData.payMethod : '',
                // statusDesc: "待审核"
              },
            })
            this.$store.commit('CHANGE_SLIDER_NAME', {
              oldUrl: '/home/cashDeposit/cashDepositList',
              newUrl: this.$router.currentRoute.fullPath,
            })
          } else {
            this.$message({
              type: 'error',
              message: response.data.errorMsg,
            })
          }
        })
        .catch((error) => {})
    },
    //保存跳转到详情
    saveToDetail() {
      this.$refs.formData.validate((valid) => {
        if (this.isHsUser()) {
          if (
            ['BANKGUARANTEE', 'BANKPOLICY'].includes(this.formData.method) &&
            !this.formData.checked
          ) {
            this.$message({
              type: 'warning',
              message: '请先同意施工单位承诺书',
            })
            return false
          }
        }
        if (valid) {
          this.$confirm(
            '是否提交缴存备案申报，提交后劳动监察会对本次备案进行审核，审核通过后即可纳入正式备案统计',
            '提示',
            {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning',
            }
          )
            .then(() => {
              this.submitFormUptate()
            })
            .catch(() => {})
        } else {
          return false
        }
      })
    },
    goBack() {
      this.$router.push('/home/cashDeposit/cashDepositList')
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: '/home/cashDeposit/cashDepositList',
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
    //计算部分免缴中的实缴金额
    changeCount() {
      let shouldPay = this.formDataShouldPay.split('-')[0]
      if (this.formData.reduceMoney > 0 && shouldPay) {
        this.axios({
          method: 'post',
          url: 'api-d/deposit/expand/calculaccount',
          data: {
            shouldPay: shouldPay,
            exemptionAccount: this.formData.reduceMoney,
          },
        })
          .then((response) => {
            if (!response.data.hasError) {
              this.calculatePayTotal = response.data.result.payTotal
            } else {
              this.$message({
                type: 'error',
                message: response.data.errorMsg,
              })
            }
          })
          .catch((error) => {})
      } else {
        this.calculatePayTotal = ''
      }
    },
    getFileListPay(val) {
      this.paySrcList.push(val)
      this.oldPaySrcList.push(val)
    },
    getFilePay(val) {
      this.uploadPayFile = val
    },
    showFileText() {
      if (this.formData.method == 'FUNDDEPOSIT') {
        this.limitationFactorPay.methodTip =
          '请上传缴款回执单，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件'
      } else if (this.formData.method == 'BANKGUARANTEE') {
        this.limitationFactorPay.methodTip =
          '请上传银行保函单，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件'
      } else if (this.formData.method == 'OWNERPOLICY') {
        this.limitationFactorPay.methodTip =
          '请上传业主担保单，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件'
      } else {
        this.limitationFactorPay.methodTip =
          '请上传保险保单，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件'
      }
      if (this.formData.payMethod == 'PART_PAY') {
        this.limitationFactor.methodTip =
          '请上传减免凭证，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件'
      } else if (this.formData.payMethod == 'ALL_NO_PAY') {
        this.limitationFactor.methodTip =
          '请上传免缴凭证，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件'
      } else if (this.formData.payMethod == 'WAIT_PAY') {
        this.limitationFactor.methodTip =
          '请上传缓缴凭证，附件格式支持png，jpg，jpeg，doc，docx，xls，xlsx，pdf，最多上传10个附件'
      }
    },
  },
}
</script>

<style scoped lang="less">
.mainCon {
  padding: 40px 10px;
  top: 198px;
  padding-bottom: 50px;
  background: #fff;
  /deep/ .el-form-item__label {
    color: #333;
  }
  // /deep/ .el-form {
  //     padding: 15px 60px;
  //     .el-input__inner {
  //         width: 340px;
  //     }
  // }
  // .el-date-editor.el-input,
  // .el-date-editor.el-input__inner {
  //     width: 340px;
  // }
  .shouldTotal {
    color: #009588;
    font-weight: bold;
  }
  // /deep/ textarea.el-textarea__inner {
  //     // width: 514px;
  //     height: 82px;
  // }
  .uploadBox {
    position: relative;
    .uploadImg {
      width: 96px;
      height: 36px;
      color: #009588;
      border: 1px solid #009588;
      line-height: 10px;
    }
    .uploadImgState {
      font-size: 14px;
      color: #999999;
      margin-left: 12px;
    }
    .upLoadDom {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      input {
        width: 100px;
        height: 36px;
        cursor: pointer;
      }
    }
  }
  .imgStyle {
    padding-left: 120px;
    li {
      position: relative;
      margin-right: 20px;
      // margin-top: 10px;
      i {
        position: absolute;
        right: -6px;
        top: -10px;
        font-size: 20px;
      }
    }
  }
  .operateBtns {
    margin-top: 20px;
  }
  .moneyUnit {
    position: absolute;
    left: 270px;
    top: 0;
  }
}
.radioTipsBox {
  position: relative;
  .radioTips {
    position: absolute;
    left: 450px;
    top: 0px;
    color: red;
  }
}
#cutRule,
#cutRuleHG {
  width: 550px;
  height: 200px;
  // display: none;
  .title {
    line-height: 40px;
    font-size: 16px;
    color: #666;
    text-align: center;
  }
  table {
    border-color: #999;
    border: 1px;
  }
  td {
    width: 25%;
    font-size: 14px;
    color: #999;
    line-height: 30px;
    padding: 0 5px;
  }
}

.formItemTip {
  color: #999;
}
</style>
